<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0">
    <title>店铺测试</title>
    <link rel="stylesheet" href="./css重置样式/reset.css">
    <link rel="stylesheet" href="./yangshi.css">
    <script src="./js/index.js"></script>
    <script src="./js/jquery.min.js"></script>
    <script src="./hudong.js"></script>
</head>
<body>
    <div class="out">
        <ul class="caidan">
            <li class="butouming"><img src="./图片/零食.png" alt=""></li>
            <li><img src="./图片/调味料.png" alt=""></li>
            <li><img src="./图片/烟酒.png" alt=""></li>
            <li><img src="./图片/日用品.png" alt=""></li>
        </ul>
        <div class="neirong">
            <div class="fenlei">
                <div class="chanpin">
                    <img src="./图片/薯片.jpg" alt="">
                    <span class="mingcheng">薯片</span>
                    <span class="jiage">￥5</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
                <div class="chanpin">
                    <img src="./图片/红茶.jpg" alt="">
                    <span class="mingcheng">冰红茶</span>
                    <span class="jiage">￥2.5</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
            </div>
            <div class="fenlei">
                <div class="chanpin">
                    <img src="./图片/酱油.jpg" alt="">
                    <span class="mingcheng">酱油</span>
                    <span class="jiage">￥1.5</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
                <div class="chanpin">
                    <img src="./图片/白醋.jpg" alt="">
                    <span class="mingcheng">醋</span>
                    <span class="jiage">￥1.5</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
            </div>
            <div class="fenlei">
                <div class="chanpin">
                    <img src="./图片/中华.jpg" alt="">
                    <span class="mingcheng">中华烟</span>
                    <span class="jiage">￥45</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
                <div class="chanpin">
                    <img src="./图片/酒.jpg" alt="">
                    <span class="mingcheng">酒</span>
                    <span class="jiage">￥12</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
            </div>
            <div class="fenlei">
                <div class="chanpin">
                    <img src="./图片/毛巾.jpg" alt="">
                    <span class="mingcheng">毛巾</span>
                    <span class="jiage">￥6</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
                <div class="chanpin">
                    <img src="./图片/香皂.jpg" alt="">
                    <span class="mingcheng">香皂</span>
                    <span class="jiage">￥3</span>
                    <div class="shuliang">
                        <a href="javascript:;" class="jian xiaoshi">-</a>
                        <span class="geshu">0</span>
                        <a href="javascript:;" class="jia">+</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="weibu">
            <div class="zhangdan">购物车</div>
            <div class="qian">￥0</div>
            <div class="fukuan">结算</div>
        </div>
        <div class="bai">
            <div class="yangshi">
                <div>商品</div>
                <div>数量</div>
                <div>单价</div>
            </div>
        </div>
        <div class="hei">
            
        </div>
    </div>
</body>
</html>